import { setToken, getToken, removeToken, setTime } from '@/utils/auth'
import { login, getUserInfo, getUserDetailById } from '@/api/user.js'
import { resetRouter } from '@/router/index.js'
export default {
  namespaced: true,
  // **初始化token状态**
  state: {
    token: getToken(),
    userInfo: {} // 用户信息
  },

  // **提供修改token的mutations**
  mutations: {
    // 定义更新vuex中的token 和更新本地储存中的token 的方法
    updateToken(sta, payload) {
      // 定义方法修改state中的token 但mutations不能触发该方法
      sta.token = payload // 将数据设置给vuex
      setToken(payload) // 将最新的token更新到本地存储 实际是覆盖
    },

    // 定义清空本地存储,清空vuex中的token 的方法
    removesToken(sta) {
      sta.token = null // 清空vuex中的token
      removeToken() // 清空本地存储
    },

    // 修改state中的个人信息userInfo
    setUserInfo(sta, result) {
      sta.userInfo = result // 这样写 响应式 ？
    },

    // 删除用户信息的
    removeUserInfo(sta) {
      sta.userInfo = {} // 设置为 空对象{} 而不是 null   因为设置为null容易在设置快捷访问时候报错
    }
  },

  // **封装登录的action**
  actions: {
    // 封装的一个方法
    async signIn(context, payload) {
      // context:执行的上下文对象
      const results = await login(payload) // 封装的登录接口请求
      // 登录成功了 将请求返回的数据中的token保存更新到state的token
      // 在actions中要修改state中的数据 context.commit('mutations中的方法', 实参)
      // context.commit('updateToken', results.data.data)
      context.commit('updateToken', results) // 响应拦截器已经提前解构好了
      setTime() // 登录成功，存入此刻的时间戳
    },

    // 在用户的vuex模块中封装获取用户资料的action，并设置相关状态
    async getUserInformation(context) {
      const result = await getUserInfo() // 获取用户的个人资料 资料中没有头像
      const baseInfo = await getUserDetailById(result.userId) // 获取用户的详细信息 包括头像
      const obj = { ...result, ...baseInfo }
      context.commit('setUserInfo', obj)
      return result // 这里为什么要返回 为后面埋下伏笔 大后期做权限处理时有用
    },

    // 退出登录 流程操作：清空token、清空本地缓存、删除用户信息userInfo
    logout(context) {
      context.commit('removesToken')
      context.commit('removeUserInfo')
      resetRouter() // 重置路由表
      context.commit('permission/setRoutes', [], { root: true })
      // 子模块调用子模块的action 可以 将 commit的第三个参数 设置成  { root: true } 就表示当前的context不是子模块了 而是父模块
      // 父模块是index.js 其中也没有setRoutes方法 所有加上了permission/  意思：父模块下的permission模块的setRoutes方法
    }
  }
}
